<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<link rel="stylesheet" type="text/css" href="/scripts/ProStyles.css" />
<link rel="stylesheet" type="text/css" href="/screens/styles.css" />
<script language="JavaScript" type="text/javascript" src="/scripts/elcontent.js"></script>
<script language="JavaScript" type="text/javascript" src="/scripts/common.js"></script>
<script language="JavaScript" type="text/javascript" src="/scripts/features.js"></script>
    <title>Library Log in</title>
    <meta http-equiv="X-UA-Compatible" content="IE=8;FF=3;OtherUA=4"><meta http-equiv="Content-type" content="text/html;charset=UTF-8">
    <meta name="viewport" content="width = device-width, user-scalable = no">
    <script type="text/javascript" src="/scripts/common.js"></script>

    <!--<link rel="stylesheet" type="text/css" href="/apps/CAS/resources/login_mobile.css">
    <link rel="stylesheet" type="text/css" href="/apps/CAS/resources/login.css" media="screen and (min-device-width: 481px)"> -->
    
    <link rel="stylesheet" type="text/css" href="/apps/CAS/resources/login_mobile.css"  />
	<style type="text/css" media="screen and (min-width: 481px)">
    <!--
    @import url("/apps/CAS/resources/login.css");
    -->
    </style>
    <!--[if IE]><link rel="stylesheet" type="text/css" href="/apps/CAS/resources/login.css"  media="screen" /><![endif]-->
    <link href="/apps/CAS/resources/login_mobile.css" rel="stylesheet" type="text/css" media="handheld, only screen and (max-device-width: 480px)" />
	<script type="text/javascript">
	<!--
		function hidePIN() {
			if (document.getElementById('pindiv')) {//if additional pin entry field exists
				var p = document.getElementById('pindiv');
				p.style.display = 'none';
			}
			if (document.getElementById('code')) {//if code entry field exists
				var c = document.getElementById('code');
				c.type = 'text';
			}
		}
		function submitFrm() {
			function testIE() {
				if (typeof window.external != 'undefined' && typeof window.external.AutoCompleteSaveForm != 'undefined') {
					return true;
				}
				return false;
			}
			var ie = testIE();
			if (ie) {
				window.external.AutoCompleteSaveForm(fm1);
			};
			document.forms['fm1'].submit();
			return true;
		}
	//-->
	</script>    
</head>

<body id="cas">

  	<div id="clientmessage">
<!-- <h1>Arlington Public Library is installing a new catalog and accounts system.<br />Account login will be not be available until later in the week.<br />Please check the Library website for updates.<br />http://library.arlingtonva.us</h1> -->

	<!--display any errors-->
  	</div> <!-- end clientmessage -->
<!--[if IE]>
<div id="ie">
<![endif]-->
<div class="loginPage">

<div class="loginTop">
&nbsp;<!-- Prevent div collapse -->
<div class="loginTopLogo">
<img src="/screens/arlpl.png" alt="Library Logo">
</div>

</div>

<!-- Use for dual external and library authentication: -->
<!-- Use for library-only authentication: -->
<div class="loginArea loginArea1Col">
<div class="clearfloats"></div>

 	<form id="fm1" class="fm-v clearfix" method="post" action="/iii/cas/login?service=http&amp;scope=1">
	<!--display any errors-->
	
	<!-- Message from client webapp to be displayed on the CAS login screen -->
  	<div id="clientmessage">
	<!--display any errors-->

	
  	</div> <!-- end clientmessage -->
	


	
	<!--display login form-->
	<div id="login">
	<fieldset>
	    <legend></legend>
<!--
	        <label for="name">Name</label>
            <div class="loginFieldBg">
              <input id="name" name="name" type="text" value="" size="20" maxlength="40" tabindex="15" class="loginField">
	        </div>  
-->
	      
			<!--
            <fieldset class="barcodeAltChoice">
            <legend>Enter your barcode or login name</legend>
			-->
                    
              <label for="code">Library Card Number (2020...)</label>

              <div class="loginFieldBg">
        	      <input id="code" name="code" type="text" value="" size="20" maxlength="40" tabindex="20" class="loginField">
		      </div>
           <!-- 
              <label for="user_name">Or: Your login/user name</label>
              <div class="loginFieldBg">
                  <input id="user_name" name="username" type="text" value="" size="20" maxlength="25" tabindex="25" class="loginField">
	          </div>
           --> 
			<!--
            </fieldset>
			-->
            
			
			
            <div id="pindiv">
				<label for="pin">4-Digit PIN</label>
				<div class="loginFieldBg">
				  <input id="pin" name="pin" type="password" value="" size="20" maxlength="30" tabindex="30" class="loginField">

				</div>
            </div>


  	
  	
  		
		
		
    

  	

        <!-- This button is hidden unless using mobile devices. Even if hidden it enables Enter key to submit. -->
        <input type="submit" name="Log In" class="loginSubmit">

	  </fieldset>
	</div> </div> <!-- end login -->

    <div class="clearfloats"></div>
    <div class="formButtons">
    	<a href="#" onclick="submitFrm();"><div onmousedown="this.className='pressedState';" onmouseout="this.className='';" onmouseup="this.className='';"><div class="buttonSpriteDiv"><span class="buttonSpriteSpan1"><span class="buttonSpriteSpan2">LOGIN</span></span></div></div></a>
  	</div>

	<!-- Spring Web Flow requirements must be in a certain place -->
	<input type="hidden" name="lt" value="_cA47CCFB4-3EAD-774F-5572-4F2AB006A3CD_kE6CE2C86-A816-6D0C-01C6-7AE4197B3EC1" />
	<input type="hidden" name="_eventId" value="submit" />
	





</div> <!-- end loginArea -->

<div class="loginActions">
<span class="loginActionScreenOnly"><a href="/pinreset">Need a PIN?</a></span><br /><br />
<span class="loginActionScreenOnly"><a href="/pinreset">Forget Your PIN?</a></span>
<span class="loginActionSeparator"></span>
<!--Enable form focus-->
<script type="text/javascript"><!--//--><![CDATA[//><!--
	//Look for the first field in the external patron part of the form. This field will get cursor focus.

	var ipssoFirstField;
	try { ipssoFirstField = document.forms[0].extpatid; }
	catch(err) {
	}
	//If we still don't have a field, look for the name field in the library account part.
	if ( ipssoFirstField==undefined ) { ipssoFirstField = document.forms[0].name; }
	//Set focus. Ignore errors.
	try { ipssoFirstField.focus(); }
	catch(err) {}

	document.onkeydown = enterSubmit;

	function enterSubmit(e) {
		var keycode;
		if (window.event) {
			keycode = window.event.keyCode;
		}
		else if (e) {
			keycode = e.which;
		}
		if (keycode==13) {
			submitFrm();
		}
	}

//--><!]]></script>

<!--
<span class="loginActionSeparator"></span>
<span class="loginAction"><a href="/">Home</a></span>
<span class="loginActionSeparator"></span>
<span class="loginAction"><a href="/*spi">Espa&#241;ol</a></span>-->
</div>
<!-- loginPage -->

<!--[if IE]>
</div>
<![endif]-->
<!-- IPSSO html form updated 2010 June 29 -->
</body>
</html>

<!--this is customized </iiidb/altdb/iiidb.arlpl/http/apps//CAS/resources/ipsso.html>-->

	</form>

